@charset "utf-8";
@import "common/reset";
@function r($px){
    @return $px/100+rem;
}
section{
    .title{
        padding: 0 r(30);
        font-size: 0;
        margin-top: r(42);
        h1{
            font-size: r(30);
            color: #010101;
        }
        .ti-bt{
            float: right;
            i{
                font-size: r(20);
                color: #c5c5c5;
                margin-left: r(44);
            }
            span{
                display: inline-block;
                font-size: r(22);
                color: #c5c5c5;
                margin-top: r(11);
            }
            span:nth-child(5){
                display: inline-block;
                font-size: r(22);
                color: #b20000;
                margin-left: r(17);
            }
            
        }
    }
    .cention-one{
        padding: 0 r(30);
        font-size: 0;
        margin-top: r(47);
        p{
            font-size: r(20);
            color: #8b8b8b;
            line-height: r(28);
            text-indent: 2em;
        }
        p:nth-child(3){
            margin-top: r(37);
        }
        p:nth-child(5){
            text-indent: 2em;
            margin-top: r(37);
        }
        .cen-img{
            width: r(580);
            height: r(270);
            margin-top: r(15);
            overflow: hidden;
            img{
                width: 100%;
            }
        }
        p:nth-child(8){
            margin-top: r(37);
        }
        .cen-img2{
            width: r(580);
            height: r(167);
            margin-top: r(15);
            overflow: hidden;
            img{
                width: 100%;
            }
        }
        .d{
            color: #000000;
            text-indent: 2em;
            margin-top: r(37);
            font-weight: bold;
        }
        p:nth-child(14){
            color: #000000;
            text-indent: 2em;
            font-weight: bold;
        }
        p:nth-child(16){
            color: #000000;
            text-indent: 2em;
            font-weight: bold;
        }
        .cen-img3{
            width: r(590);
            height: r(274);
            margin-top: r(19);
            overflow: hidden;
            img{
                width: 100%;
            }
        }
        h1{
            margin-top: r(23);
            font-size: r(20);
            color: #000000;  
        }
        .d2{
            font-size: r(20);
            color: #8b8b8b;
            text-indent: 0;
            margin-top: r(36);
        }
        .cen-img4{
            width: r(583);
            height: r(170);
            overflow: hidden;
            margin-top: r(27);
            margin-bottom: r(36);
            img{
                width: 100%;
            }
        }
        .cen-img5{
            width: r(582);
            height: r(241);
            overflow: hidden;
            margin-top: r(22);
            margin-bottom: r(26);
            img{
                width: 100%;
            }
        }
        .d3{
            font-size: r(20);
            color: #8b8b8b;
            text-indent: 0;
        }
        .cen-img6{
            width: r(581);
            height: r(299);
            overflow: hidden;
            margin-top: r(18);
            margin-bottom: r(27);
            img{
                width: 100%;
            }
        }
        .cen-img7{
            width: r(527);
            height: r(277);
            overflow: hidden;
            margin-top: r(18);
            img{
                width: 100%;
            }
        }
    }
    .cention-two{
        font-size: 0;
        border-top: r(19) solid #efefef;
        border-bottom: r(19) solid #efefef;
        margin-top: r(34);
        padding: 0 r(29);
        h1{
            display: inline-block;
            font-size: r(21);
            color: #727171;
            margin: r(30) 0;
        }
        span{
            display: inline-block;
            font-size: r(18);
            color: #727171;
        }
    }
    .cention-ter{
        width: r(326);
        margin: 0 auto;
        font-size: 0;
        .ter-img{
            width: 32%;
            font-size: 0;
            text-align: center;
            display: inline-block;
            margin-top: r(38);
            img{
            width: r(72);
            height: r(72);
            }
            i{
                font-style: normal;
                font-size: r(20);
                color: #8b8b8b;
                display: block;
                margin-top: r(8);
            }
        }
    }
    .comment{
        width: r(585);
        height: r(193);
        border: r(1) solid #c9c9c9;
        text-align: center;
        margin: 0 auto;
        margin-top: r(50);
        a{
            font-size: r(20);
            text-decoration: underline;
            color: #b20000; 
        }
        span{
            font-size: r(20);
            color: #8B8B8B;
        }
    }
    .pl{
        font-size: 0;
        margin-top: r(16);
        display: block;
        text-align: center;
        input{
            width: r(395);
            height: r(53);
            border: 0;
            font-style: normal;
            background: #B20000;
            text-align: center;
            line-height: r(53);
            color: white;
        }
    }
    #check10{
         display: none;
     }
     #check10:checked ~.comment_02>.comment_sel{
         display: block;
     }
     #check10:checked ~.comment_02>.answer span{
         transform: rotate(90deg);
     }
    .comment_02{
        width: r(572);
        margin: 0 auto;
        margin-top: r(49);
        p{
            color: #727171;
            font-size: r(18);
            line-height: r(18);
            span{
                text-decoration: underline;
            }
        }
        .comment_02_pic{
                margin-top: r(25);
            .comment_02_img{
                width: r(50);
                height: r(50);
                font-size: 0;
                overflow: hidden;
                float: left;
                img{
                    width: 100%;
                    border-radius: 50%;
                }
            }
            p{
                font-size: r(18);
                line-height: r(18);
                color: #444444;
                margin-top: r(16);
                margin-left: r(12);
                float: left;
                span{
                    font-size: r(18);
                    color: #b2b2b2;
                    margin-left: r(9);
                    text-decoration: none;
                }
            }
        }
        p:nth-child(3){
            font-size: r(22);
            color: #444444;
            line-height: r(22);
            margin-top: r(12);
            margin-left: r(8);
        }
            p:nth-child(4){
                font-size: r(18);
                color: #b2b2b2;
                text-decoration: none;
                line-height: r(22);
                text-align: right;
                margin-top: r(8);
            }
            .answer {
                width: r(150);
                float: right;
                p{
                text-align: right;
                margin-top: r(20);
                font-size: r(20);
                line-height: r(20);
                color: #444444;
                span{
                    font-size: r(10);
                    color: #c9c9c9;
                    text-decoration: none;
//                  transform: rotate(0deg);
                    display: block;
                    float: right;
                    margin-left: r(5);
                }
            }
             }
             
            .comment_sel{
                width: r(535);
                height: r(376);
                background: #fafafa;
                margin: 0 auto;
                margin-top: r(49);
                border: r(1) solid #efefef;
                display: none;
                .mimo{
                    width: r(522);
//                  margin: 0 auto;
                    padding-top: r(19);
                    padding-bottom: r(14);
                    border-bottom: r(1) dashed #c9c9c9;
                    .mimo_pic{
                        width: r(40);
                        height: r(40);
                        font-size: 0;
                        margin-right: r(6);
                        overflow: hidden;
                        float: left;
                        img{
                            width: 100%;
                            border-radius: 50%;
                        }
                    }
                    p:nth-child(2){
                        font-size: r(18);
                        line-height: r(36);
                        color: #444444;
                    }
                    p:nth-child(3){
                        font-size: r(18);
                        line-height: r(18);
                        color: #b2b2b2;
                        float: right;
                        margin-top: r(35);
                    }
                }
                textarea{
                    width: r(497);
                    height: r(72);
                    display: block;
                    font-size: r(18);
                    padding-left: r(5);
                    padding-top: r(5);
                    resize: none;
                    color: #444444;
                    margin: 0 auto;
                    border: r(1) solid #efefef;
                    background: #fff;
                    margin-top: r(20);
                }
                .fabiao{
                    width: r(174);
                    height: r(45);
                    margin-top: r(8);
                    margin-right: r(25);
                    padding-top: r(5);
                    background: #b20000;
                    float: right;
                    font-size: r(20);
                    color: #fff;
                    text-align: center;
                }
        }
    }
    .more{
        width: r(585);
        margin: 0 auto;
        margin-top: r(30);
        border-top: r(1) solid #e6e6e6;
        text-align: center;
        a{
          font-size: r(2);  
          color: #BBBBBB;
          vertical-align: middle;
        }
    }
}